<template>
	<div>
		<div v-if="!error">
			<van-address-edit
				v-if="areaList"
				:area-list="areaList"
				save-button-text="支付"
				fixed
				@save="onSave"
			>
			</van-address-edit>
			<center>
				<van-button type="default" @click="onDelete()" class="max_width">查看已点快餐</van-button>
			</center>
			<van-action-sheet
				class="pro"
				align="left"
				v-model="show"
				cancel-text="关闭"
				:actions="actions"
			/>
		</div>
		<div v-if="error == 'loginError'">
			获取身份信息失败，请稍后重试
		</div>
		<div v-if="error == 'payError'">
			支付出了点问题，请稍后重试
		</div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				show: false,
				areaList:null,
				goods: this.$route.params.goods,
				price: this.$route.params.price,
				actions:[],
				error:this.$route.query.error,
			}
		},
		created() {
			this.$http.get(
				"/api/areaList.json"
			).then(response => {
				this.areaList = response.data
			});
			this.goods.forEach((item, index) => {
				this.actions.push({
					name: item.productName,
					subname: '\t\t\tx'+item.productQuantity+'\t\t\t￥'+item.productPrice
				})
			});
		},
		methods: {
			onSave(content) {
				console.log(content)
				let order = {
					buyerName: content.name,
					buyerPhone: content.tel,
					buyerAddress: content.province+content.city+content.county+content.addressDetail,
					orderAmount: this.price / 100,
					orderDetails: this.goods
				}
				this.$http.post(
					"/api/orderMaster/createOrder",
					order
				).then(response => {
					window.location.href = response.data.data;
				}).catch(error => {
					
				}).finally(() => {
				});
			},
			onDelete() {
				this.show = !this.show
			},
		},
	}
</script>

<style scoped="scoped">
	.float_right {
		float: right;
	}
	._fixed {
		position: fixed;
		top: 20px;
		width: 90%;
	}
	._margin_top {
		margin-top: 70%;
	}
	.bgColor {
		background: darkgray;
	}
	.max_width {
		width: 91%;
	}
	.pro {
		white-space: pre;
		text-align: left;
	}
</style>
